<template>
  <div >
    <div class>
        <el-breadcrumb separator=">">
        <el-breadcrumb-item
          v-for="(item, index) in breadList"
          :key="index"
          v-if="index<breadList.length-1"
          :to="{ path: item.path }"
        >{{ item.meta.title }}
        </el-breadcrumb-item>
      </el-breadcrumb>
    </div>
  </div>
</template>
<script>
  export default {
    data() {
      return {
        breadList: [], // 路由集合
      };
    },
    watch: {
      $route() {
        this.getBreadcrumb();
      },
    },
    methods: {
      isHome(route) {
        return route.name === "后台中心";
      },
      getBreadcrumb() {
        let matched = this.$route.matched;
        if (!this.isHome(matched[0])) {
          matched = [{ path: "/home", meta: { title: "后台中心" } }].concat(matched);
        }
        if (matched[matched.length - 1].meta.title == "学生信息") {
          matched = [
            { path: "/home", meta: { title: "后台中心" } },
            { path: "", meta: { title: "信息检索" } },
            { path: "/studenttable", meta: { title: "学生信息" } },
          ].concat(matched[matched.length - 1]);
        }
        if (matched[matched.length - 1].meta.title == "教师信息") {
          matched = [
            { path: "/home", meta: { title: "后台中心" } },
            { path: "", meta: { title: "信息检索" } },
            { path: "/studenttable", meta: { title: "教师信息" } },
          ].concat(matched[matched.length - 1]);
        }
        if (matched[matched.length - 1].meta.title == "课程信息") {
          matched = [
            { path: "/home", meta: { title: "后台中心" } },
            { path: "", meta: { title: "信息检索" } },
            { path: "/studenttable", meta: { title: "课程信息" } },
          ].concat(matched[matched.length - 1]);
        }
        if (matched[matched.length - 1].meta.title == "课程管理") {
          matched = [
            { path: "/home", meta: { title: "后台中心" } },
            { path: "/studenttable", meta: { title: "课程管理" } },
          ].concat(matched[matched.length - 1]);
        }
        if (matched[matched.length - 1].meta.title == "学生管理") {
          matched = [
            { path: "/home", meta: { title: "后台中心" } },
            { path: "/studenttable", meta: { title: "学生管理" } },
          ].concat(matched[matched.length - 1]);
        }
        if (matched[matched.length - 1].meta.title == "教师管理") {
          matched = [
            { path: "/home", meta: { title: "后台中心" } },
            { path: "/studenttable", meta: { title: "教师管理" } },
          ].concat(matched[matched.length - 1]);
        }
        if (matched[matched.length - 1].meta.title == "订单管理") {
          matched = [
            { path: "/home", meta: { title: "后台中心" } },
            { path: "/studenttable", meta: { title: "订单管理" } },
          ].concat(matched[matched.length - 1]);
        }
        if (matched[matched.length - 1].meta.title == "权限管理") {
          matched = [
            { path: "/home", meta: { title: "后台中心" } },
            { path: "/authority", meta: { title: "权限管理" } },
          ].concat(matched[matched.length - 1]);
        }
        this.breadList = matched;
      },
    },
    created() {
      this.getBreadcrumb();
    },
  };
</script>
<style scoped>
  .bread /deep/ .el-breadcrumb {
    display: inline-block;
    display: inline-block;
    height: 48px;
    vertical-align: top;
    line-height: 48px;
  }
  .bread /deep/ .is-link {
    font-weight: normal;
  }
  .bread {
    float: left;
  }
</style>

